<!-- 业务派单 - 我的待办 - 基本信息 -->
<template>
  <div ref="queryFormBox" class="search-flex-box">
    <PmsForm
      ref="formRef"
      v-model="prjnameObj"
      :form-option="formOption"
      :select-list="dicLists"
    >
      <template #remarks>
        <el-input
          v-model="prjnameObj.remarks"
          style="width: 100%"
          :rows="4"
          type="textarea"
          resize="none"
          :disabled="true"
        />
      </template>
    </PmsForm>
  </div>
</template>

<script>
    import PmsForm from '@/views/businessOperation/pmsForm'

    // 查询条件配置
    const formOption = {
    size: 'mini',
    inline: true,
    labelWidth: '160px',
    itemData: [
        {
            type: 'input',
            prop: 'prjCode',
            value: '',
            width: '',
            colSpan: 6,
            clearable: true,
            disabled: true,
            label: '项目编码'
        },
        {
            type: 'input',
            prop: 'setId',
            value: '',
            width: '',
            colSpan: 6,
            clearable: true,
            disabled: true,
            label: '站址编码'
        },
        {
            type: 'input',
            prop: 'prjName',
            value: '',
            width: '',
            colSpan: 6,
            clearable: true,
            disabled: true,
            label: '项目名称'
        },
        {
            type: 'input',
            prop: 'setName',
            value: '',
            width: '',
            colSpan: 6,
            clearable: true,
            disabled: true,
            label: '站址名称'
        },
        {
            type: 'input',
            prop: 'prjYear',
            value: '',
            width: '',
            colSpan: 6,
            clearable: true,
            disabled: true,
            label: '项目年份'
        },
        {
            type: 'input',
            prop: 'orgName',
            value: '',
            width: '',
            colSpan: 6,
            clearable: true,
            disabled: true,
            label: '建设单位'
        },
        {
            type: 'input',
            prop: 'prjTypeName',
            value: '',
            width: '',
            colSpan: 6,
            clearable: true,
            disabled: true,
            label: '项目类型'
        },
        {
            type: 'input',
            prop: 'buildModesName',
            value: '',
            width: '',
            colSpan: 6,
            clearable: true,
            disabled: true,
            label: '建设方式'
        },
        {
            type: 'input',
            prop: 'isReceiveName',
            value: '',
            width: '',
            colSpan: 6,
            clearable: true,
            disabled: true,
            label: '立项申请人'
        },
        {
            type: 'input',
            prop: 'projectManagerName',
            value: '',
            width: '',
            colSpan: 6,
            clearable: true,
            disabled: true,
            label: '项目管理岗位'
        },
        {
            type: 'slot',
            prop: 'remarks',
            value: '',
            width: '',
            colSpan: 24,
            clearable: true,
            placeholder: '',
            label: '备注'
        }
    ]
    }

    export default {
        name: 'BasicMessage',
        components: {
        //   TCollapse,
            PmsForm
        },
        props: {
            prjnameObj: {
            type: Object,
            default: () => ({})
            }
        },
        data() {
            return {
                formOption, // 查询条件配置项
                dialogCheckbox: false, // 自定义列表弹框
                dicLists: {} // 下拉框字典选项集合
            }
        },
        created() {
            this.$nextTick(() => {
                this.setHeight(false)
            })
        },
        methods: {
            // 设置高度
            setHeight(isFold) {
                const child = this.$refs.formRef.$refs
                const height = (formOption.itemData.length / 6).toFixed() - 0
                console.log(child, '🚗')
                this.$refs.queryFormBox.style.height = isFold ? `${height * 24}px` : '178px'
            }
        }
    }
</script>

<style lang="scss" scoped>
    .search-flex-box {
        // display: flex;
        // justify-content: space-between;
        height: auto;
    }
    .searchBtn {
        width: 100px;
        margin-left: auto;
        display: flex;
        margin-top: 4px;
        flex-direction: column;
        .el-button + .el-button {
            margin-left: 0;
            margin-top: 8px;
        }
    }

    .electronicSignature {
        width: 100%;
        .mainDetails {
            padding: 20px 25px 0px;
        }
        .topRemark {
            // background-color: #fdf5e6;
            background-color: #ffefd5;
            width: 100%;
            height: 40px;
            line-height: 40px;
            padding-left: 10px;
            font-size: 14px;

            .asterisk {
                color: #f00;
                margin-right: 2px;
                font-size: 18px;
            }
        }

        .customBtn {
            height: 20px;
            line-height: 20px;
            font-size: 14px;
            margin: 10px 20px 10px 90%;
            cursor: pointer;

            .el-icon-s-tools {
                font-size: 20px;
                color: #999;
                margin-right: 6px;
            }
        }
    }

    .el-button--text {
        color: #02A7F0;
    }

    .el-button--primary {
        color: #fff;
    }
    .dialog-footer {
        display: flex;
        justify-content: center;
    }
    ::v-deep .el-button + .el-button {
        color: #fff;
    }
    // 弹框样式
    ::v-deep .el-dialog__body {
        max-height: 400px;
        overflow-y: auto;
        margin: 0px;
    }
    // 滚动条样式
    ::v-deep .el-dialog__body::-webkit-scrollbar {
    // 滚动条整体样式
    width: 6px; //高宽分别对应横竖滚动条的尺寸
    height: 10px;
    }
    ::v-deep .el-dialog__body::-webkit-scrollbar-thumb {
    // 滚动条里面小方块
    border-radius: 10px;
    // -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
    background: #f2f3f5;
    }
    ::v-deep .el-range-editor.el-input__inner {
        padding: 0px 10px;
    }

    .topBtn {
        text-align: center;
        padding: 20px;
    }
    ::v-deep .el-tag {
        border: none;
        color: #02A7F0;
        background-color: #FFFFFF;
    }
    ::v-deep .el-dialog__title {
        font-size: 14px;
        font-weight: bold;
    }
    ::v-deep .el-col-24 {
        height: 110px;
    }
    ::v-deep .el-textarea.is-disabled .el-textarea__inner {
        background-color: #f7f7f7;
    }
</style>

